<%@ page contentType="text/html;charset=UTF-8" trimDirectiveWhitespaces="true"%>
<link rel="stylesheet" type="text/css" href="${ctxStatic}/assets/global/plugins/select2/select2.css" />
<link rel="stylesheet" href="${ctxStatic}/assets/global/plugins/data-tables/DT_bootstrap.css" />
<script type="text/javascript" src="${ctxStatic}/assets/global/plugins/data-tables/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/assets/global/plugins/data-tables/DT_bootstrap.js"></script>
<script>
var JDataTable=function(searchForm,table,pageSize,dataTableParam){
	this.searchForm		= searchForm;	// 查询form对象
	this.table			= table;		// 数据列表tab对象
	this.pageSize		= pageSize;		// 显示数据行数
	this.dataTableParam	= dataTableParam;	// dataTable参数设置
	this.resultDataTable;
	
	if(this.searchForm==undefined)
		this.searchForm = jQuery('#searchForm');
	if(this.table==undefined)
		this.table = jQuery('#userTable');
	if(this.pageSize==undefined)
		this.pageSize = 10;
	if(this.dataTableParam==undefined)
		this.dataTableParam = new Object();
	// this.dataTableParam = this.addDataTableParam(this.dataTableParam);
	
}
// 加载，初始化时定义
JDataTable.prototype.load=function(){
	this.setPage();
	this.query();
}

/** 设置page信息 */
JDataTable.prototype.setPage=function(){
	// 1、当前页和数据行，添加查询form
	var pageNO = '<input id="pageNo" name="page.pageNo" type="hidden" value="1"/>';
	var pageSize = '<input id="pageSize" name="page.pageSize" type="hidden" value="'+this.pageSize+'"/>';
	this.searchForm.append(pageNO).append(pageSize);
	// 2、分页htmml，添加到table后
	var pageHtml = '<div class="pagination" style="margin:0px;" ></div>';
	this.table.after(pageHtml);
}
/** 执行查询操作 */
JDataTable.prototype.query=function(){
	// 定义this对象，下边使用
	var obj = this;
	// 异步调用
	$.ajax({
		type:"post", 
		url:this.searchForm.attr("action"),
		data:this.searchForm.serialize(),
		dataType:"json",
		async:false,
		success:function(page){
			showData(page.list);
			jQuery('.pagination').html(page.html);
			// 一定要在ajax外定义this，否则会出错
			// obj.tableInit();
		}
	});
}

// 显示数据
function showData(data){
	// todo，需要自己实现【不同的业务数据不同】
}


/** 初始化dataTable */
JDataTable.prototype.tableInit=function(){
	if(this.resultDataTable!=undefined){
		this.resultDataTable.fnClearTable(false);
	}
	var winHeight= $(window).height();			
	var seaHeight=this.searchForm.height()+15;
	var height=0;
	var display=this.searchForm.css("display");
	if(display=="block"){
		height=winHeight-seaHeight-200;
	}else{
		height=winHeight-200;
	}
	// this.dataTableParam.sScrollY=height; // 锁定thead
	this.resultDataTable = this.table.dataTable(this.dataTableParam);
	
	alert(0);
}
/** 添加默认的参数 */
function addDataTableParam(dataTableParam){
	// 设置参数
	dataTableParam.bPaginate=false;	// 开关，是否显示分页器
	dataTableParam.bFilter=false;		// 开关，是否启用查询
	dataTableParam.bInfo=false;		// 开关，是否显示表格的一些信息
	dataTableParam.bDestroy=true;		// 用于当要在同一个元素上履行新的dataTable绑按时，将之前的那个数据对象清除掉，换以新的对象设置
	return dataTableParam;
}
</script>